﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>我的书架</title>
    <meta name="robots" content="all">
    <meta name="googlebot" content="all">
    <meta name="baiduspider" content="all">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    <link rel="stylesheet" data-ignore="true" href="/Public/home/css/sprite.8d3e7.css"/>
    <link rel="stylesheet" href="//at.alicdn.com/t/font_421713_nqy49l11qlkawcdi.css" />
    <script src="/Public/home/js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
    <style type="text/css">
        @font-face {
            font-family: 'iconfont';  /* project id 421713 */
            src: url('//at.alicdn.com/t/font_421713_nqy49l11qlkawcdi.eot');
            src: url('//at.alicdn.com/t/font_421713_nqy49l11qlkawcdi.eot?#iefix') format('embedded-opentype'),
            url('//at.alicdn.com/t/font_421713_nqy49l11qlkawcdi.woff') format('woff'),
            url('//at.alicdn.com/t/font_421713_nqy49l11qlkawcdi.ttf') format('truetype'),
            url('//at.alicdn.com/t/font_421713_nqy49l11qlkawcdi.svg#iconfont') format('svg');
        }
        .footer{width: 100%;position: fixed;left: 0;right: 0;bottom: 0;background: #fff;border-top: 1px solid #ddd;display: table;z-index: 9;}
        .footer ul{display: table-row;}
        .footer li{display: table-cell;text-align: center;}
        .footer li a{height: 49px;line-height: 49px;display: block;font-size: 0.9rem;color: #a0a0a0;font-family: "Microsoft Yahei", sans-serif}
        .footer li a.active{color: #ff730b;}
        .footer li a i{width: 17px;height: 17px;display: inline-block;background: url(/Public/home/images/column.png) no-repeat;background-size: 115px 17px;position: relative;top: 4px;margin-right: 6px;}
        .footer li a i.icon-book{background-position: 0 0;}
        .footer li a.active i.icon-book{background-position: -20px 0;}
        .footer li a i.icon-choice{background-position: -42px 0;}
        .footer li a.active i.icon-choice{background-position: -61px 0;}
        .footer li a i.icon-my{background-position: -80px 0;}
        .footer li a.active i.icon-my{background-position: -98px 0;}

    </style>
</head>
<body class=" unlogin">
<script data-ignore="true" src="/Public/home/js/sprite.84759.js"></script>
<div class="page page-bookshelft-my">
    <div class="content">
        <header id="header" class="header" data-l1="41">
            <nav class="btn-group btn-group-small">
                <h3 class="btn-group-cell"><a href="/Home/Shelf/index" class="btn-tab active">我的书架</a></h3>
                <h3 class="btn-group-cell"><a href="/Home/Shelf/myhistory" class="btn-tab">最近阅读</a></h3>
                <h3 class="btn-group-cell"><a href="/Home/Shelf/novelsign" class="btn-tab">我的书签</a></h3>
            </nav>


        </header>

    </div>
    <div id="editBtnHeader" class="mybook-module-header">
        <header class="mybook-default-header">
            <!--<div class="module-header-l">
                <a href="javascript:" id="filterGroup" class="mybook-sub-title" role="combobox"
                   title="点击出现浮层，可更换选项，选项列表在浮层底部">
                    <aria>请选择书架分组：</aria>
                    <ul class="select-ul" id="bookGroupListSwitchtContainer">

                        <li class="select-option selected" data-group-id="-100">书架
                        </li>

                    </ul>
                    <i class="select-tri"></i>
                </a>

            </div>-->
            <a class="select-ul" id="bookGroupListSwitchtContainer">共{$book_list_count}条记录</a>
            <a href="javascript:" id="bookEditBtn" class="header-opt-a-r" role="button"
               title="可对书架书籍分组或删除，操作栏在底部，选中任意一本书籍操作栏即出现">编辑</a>
            <a href="javascript:" id="bookEditBtnre" class="header-opt-a-r" role="button"
               style="right: 60px;color: #ed424b;display: none;" title="可对书架书籍分组或删除，操作栏在底部，选中任意一本书籍操作栏即出现">删除</a>
        </header>
    </div>

    <ol id="bookEditOl" style="padding-bottom: 12%;" class="book-ol book-ol-progress" data-sort-type="2" data-count-num="3" data-page-size="20">
                 <span class="list-split-1">
                 <if condition="$book_list neq ''">
                     <volist name="book_list" id="item">
                        <li class="book-li book-init-recomm" data-book-id="{$item.novel_id}" data-list-type="list-book">
                            <i class="radio">
                                <svg class="icon icon-ok"></svg>
                            </i>
                            <div class="book-layout">
                                <div class="rel">
                                    <a href="" class="mybook-to-detail" aria-hidden="true">

                                        <!--<img src="{:C('FILE_HOST_PATH')}.{$item.novel_img}" class="book-cover"  alt="">-->
                                        <img src="{$item.novel_img}" class="book-cover"  alt="">
                                    </a>
                                    <a href="#" class="book-title-x">
                                        <h4 class="book-title">{$item.novel_name}
                                            <if condition="$item.is_recommend eq 1"><i class="iconfont icon-jian" style="color: orange;"></i></if>
                                            <span class="tag-small-group">
                                            </span>
                                        </h4>
                                    </a>
                                </div>
                                <a href="/Home/Novel/novelinfo/id/{$item.novel_id}" class="mybook-to-goon">
                                    <div class="book-title-x">
                                        <div class="book-title-r">
                                            <span class="gray">继续阅读</span>
                                            <svg class="icon icon-arrow-r" aria-hidden="true">
                                                <use xmlns:xlink="http://www.w3.org/1999/xlink"
                                                     xlink:href="#icon-arrow-r"></use>
                                            </svg>
                                        </div>
                                    </div>
                                    <div class="book-meta">
                                        <p class="ell">
                                            <svg class="icon icon-human" role="img" title="作者">
                                                <use xmlns:xlink="http://www.w3.org/1999/xlink"
                                                     xlink:href="#icon-human"></use>
                                            </svg>
                                            <if condition="$item.writer neq ''">{$item.writer}<else/>佚名</if> | <if condition="$item['history_chapter'] eq '尚未阅读'">尚未阅读<else/>已看到{$item.history_chapter}</if>
                                        </p>
                                    </div>
                                </a>
                                <div class="rel">
                                    <a href="#" class="mybook-to-new">
                                        <div class="book-meta">

                                            <p class="ell">
                                                <if condition="$item.dian neq ''"><i class="dot red"></i></if>更新至 {$item.latest_chapter_info}
                                            </p>
                                        </div>
                                    </a>
                                </div>

                            </div>
                            <a href="javascript:" class="mybook-cover-btn" role="checkbox" aria-checked="false"
                               title=""></a>
                        </li>
                     </volist>
                 </if>
                 <?php if(empty($book_list)):?>
                         <div style="position: fixed;text-align: center;top: 45%;left: 0;right: 0;margin: auto;">
                             <p>你的书架中什么也没有~</p>
                             <br>
                             <p><a style="margin:auto;border-radius:5px;border: 1px solid #10AEFF;width:100px;height:45px;line-height:45px;display: block;background-color: #10AEFF;color: white" href="/Home/Index/index">马上去添加</a></p>
                         </div>
                 <?php endif;?>
                  </span>

    </ol>
</div>
<div class="footer" id="footer_nav">
    <ul>
        <li>
            <a href="/Home/Shelf/index"><i class="icon-book"></i>书架</a>
        </li>
        <li>
            <a href="/Home/Index/index"><i class="icon-choice"></i>首页</a>
        </li>
        <li>
            <a href="/Home/User/userinfo"><i class="icon-my"></i>我的</a>
        </li>
    </ul>
</div>


<a href="#header" class="footer-backtop-circle jsBackToTop" title="返回顶部" data-l1="40" data-eid="mqd_A51">
    <svg class="icon icon-backtop">
        <use xlink:href="#icon-backtop"></use>
    </svg>
</a>
</body>
<script type="text/javascript">
    $(function() {
        $('#footer_nav li a').removeClass('active');
        $('#footer_nav li').eq(0).find("a").addClass('active');
    })
    $('#bookEditBtn').click(function () {
        if ($(this).text() == "编辑") {
            $("#bookEditBtnre").show();
            $('.book-layout').css('padding-left', '3rem');
            $(".book-li a").attr("onclick","return false");
            $(this).text("完成");
        } else {
            $("#bookEditBtnre").hide();
            $('.book-layout').css('padding-left', '1rem');
            $('.book-init-recomm').removeClass('checked');
            $(".book-li a").attr("onclick","");
            $(this).text("编辑");
        }
    })
    $('.book-init-recomm').click(function () {
        if ($(this).attr('class') == 'book-li book-init-recomm') {
            $(this).addClass('checked');
        } else {
            $(this).removeClass('checked');
        }
    })

    $("#bookEditBtnre").click(function(){
        var novelId = [];
         $('.book-li').each(function(i){
            if ($(this).attr('class') == 'book-li book-init-recomm checked'){
                $(this).remove();
                if(0==i){
                    novelId.push($(this).attr("data-book-id"));
                }else{
                    novelId.push($(this).attr("data-book-id"));
                }
            } 
         }) 
         if (novelId == '') {
             alert("请选择小说");
         }else{
            $.post("/home/shelf/ajaxshelfdel",{datas:novelId},function(data){
                var count = $('#bookEditOl li').length;

                $('#bookGroupListSwitchtContainer').text('共'+count+'条记录');
                if (data == 0) {
                    // 如果为0表示没有数据了
                   var html = '<div style="position: fixed;text-align: center;top: 45%;left: 0;right: 0;margin: auto;"><p>你的书架中什么也没有~</p><br><p><a style="margin:auto;border-radius:5px;border: 1px solid #10AEFF;width:100px;height:45px;line-height:45px;display: block;background-color: #10AEFF;color: white" href="/Home/Index/index">马上去添加</a></p></div>';
                    $("#bookEditOl").append(html);
                    $('#bookGroupListSwitchtContainer').text('没有记录');
                }
          },"json")
         }
          
    })
</script>
</html>